{% extends 'zgh0381/base.html' %}

{% block title %}
     Swift网盘管理系统|swift容器列表页
{% endblock title %}

{% block main %}
    <h1 class="page-header">Swift容器管理页面</h1>
    <!-- 面板开始 -->
    <div class="panel panel-primary">
        <div class="panel-heading">Swift容器列表 <i class=" glyphicon glyphicon-trash pull-right"></i></div>
        <div class="panel-body">
            <div class="row" style="margin-bottom: 15px">
                <div class="col-md-4">
                    <div class="input-group">
                        <input type="text" class="form-control" placeholder="Search for...">
                        <span class="input-group-btn">
                                    <button class="btn btn-default" type="button">搜索</button>
                                </span>
                    </div><!-- /input-group -->
                </div><!-- /.col-md-4 -->
                <div class="col-md-3 pull-right">
                    <a href="{% url 'zhanggh0381:list_containers' %}" class="btn btn-success pull-right"><i
                            class="fa fa-plus fa-fw"></i>新增容器</a>
                    <button class="btn btn-success pull-right" data-toggle="modal" data-target="#myModal">新增
                    </button>
                </div>

            </div><!-- /.row -->

            <table class="table table-bordered table-hover" id="tab">
                {% csrf_token %}
                <thead>
                <tr>
                    <th>容器名</th>
                    <th>对象数</th>
                    <th>对象所占大小</th>
                    <th>操作</th>
                </tr>
                </thead>
                <tbody >
                {% for containers in request.session.list_containers %}
                    <tr>
                       <td><img src="/static/img/dirtory.png">{{ containers.name }}</td>
                        <td>{{ containers.count }}</td>
                        <td>{{ containers.bytes|filesizeformat }}</td>
                        <td><button class="btn btn-danger delete_btn"  ><i
                                class="fa fa-trash-o fa-fw" ></i>删除</button>&nbsp
                            <a class="btn btn-info fa-eye_btn obj_btn"   href="{% url 'zhanggh0381:detail_container' containers.name  %}" >
                                <i class="glyphicon glyphicon-eye-open" ></i>&nbsp;预览</a></td>
                    </tr>
                {% endfor %}
                </tbody>
                {% csrf_token %}
            </table>
        </div>
    </div>
    <nav aria-label="Page navigation">
      <ul class="pagination">
        <li>
          <a href="#" aria-label="Previous">
            <span aria-hidden="true">&laquo;</span>
          </a>
        </li>
        <li class="active"><a href="#">1 <span class="sr-only">(current)</span></a></li>
        <li><a href="#">2</a></li>
        <li><a href="#">3</a></li>
        <li><a href="#">4</a></li>
        <li><a href="#">5</a></li>
        <li>
          <a href="#" aria-label="Next">
            <span aria-hidden="true">&raquo;</span>
          </a>
        </li>
      </ul>
    </nav>
    <script src="/static/Sweetarlt/sweetalert.min.js"></script>
    <script src="/static/libs/jquery-1.12.4/jquery.min.js"></script>
    <script src="/static/toastr.js"></script>
    <script type="text/javascript" >

        /* 删除 */
        //为单个删除绑定单击事件
		$(document).on("click",".delete_btn",function(){

		    var containerName = $(this).parents("tr").find("td:eq(0)").text();
		     swal({
            title: "你确定要删除吗？",
            text: "删除可就找不回来了哦！",
            type: "warning",
            showCancelButton: true,
            confirmButtonClass: "btn-danger",
            confirmButtonText: "删除",
            cancelButtonText: "取消",
            closeOnConfirm: false

      },function () {

                $.ajax({
					url:"/zgh0381/delete_containers/",
					type:"POST",
                    data:{"containername": containerName},
                     beforeSend: function (xhr, settings) {
                    xhr.setRequestHeader("X-CSRFToken", "{{ csrf_token }}");
                },
					success:function(result){

						        //显示处理成功
                                  if(result.res == 1){
                                      swal('删除','容器已删除','success');
                                      toastr.success("删除成功!")
                                       //刷新
                                        window.location.href = "/zgh0381/list_containers/";

                                     }else{
                                        toastr.error("删除失败!请先删除文件");
                                  }



					        }
				        });
                    })




             })
    toastr.options = { // toastr配置
        "closeButton": true, //是否显示关闭按钮
        "debug": false, //是否使用debug模式
        "progressBar": true, //是否显示进度条，当为false时候不显示；当为true时候，显示进度条，当进度条缩短到0时候，消息通知弹窗消失
        "showDuration": "50000", //显示的动画时间
        "hideDuration": "50000", //消失的动画时间
        "timeOut": "50000", //展现时间
        "extendedTimeOut": "1000", //加长展示时间
        "showEasing": "swing", //显示时的动画缓冲方式
        "hideEasing": "linear", //消失时的动画缓冲方式
        "showMethod": "fadeIn", //显示时的动画方式
        "hideMethod": "fadeOut" //消失时的动画方式
    }


    </script>

{% endblock main %}

{% block container_list %}
    active
{% endblock container_list %}